<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>OA协同办公系统</title>
<style type="text/css" >
.divuser{ background:#EBEBEB; width:650px; height:350px; border:#CCC double 2px}
</style>
<link type="text/css" rel="stylesheet" href="css/table.css">
<link rel="stylesheet" href="js/easyui/themes/default/easyui.css" />
   <link rel="stylesheet" href="js/easyui/themes/icon.css" />
  <script type="text/javascript" src="js/easyui/jquery-1.4.4.min.js"></script>
    <script type="text/javascript" src="js/easyui/jquery.easyui.min.js"></script>
        <script type="text/javascript" src="js/select.js"></script>
		<script type="text/javascript">
		$(function(){
             $("#tt2").tree({   
                 checkbox: false,   
                 url: 'nodeExecutorTree.action',   
                 onClick:function(node){
                 	var show=$("#show").val();
                        getOrg(show);
                  }
              });  
			});

function getOrg(id){
	var  param={"nodeId":id};
	$.post("getCandidateTree.action",param,function(data){
		var list=data.userList;
		var obj1=document.getElementById("obj1");
		clear(obj1);
		for(var i=0;i<list.length;i++){
			addItem(obj1,list[i].id,list[i].name);
		}
	},"json");

}

function func1(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveTo(from,to);
	}
	function func2(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveTo(from,to);
	}
	function func3(){
	var from = document.getElementById("obj1");
	var to = document.getElementById("obj2");
	moveAll(from,to);
	}
	function func4(){
	var from = document.getElementById("obj2");
	var to = document.getElementById("obj1");
	moveAll(from,to);
	}

 function addUser(){
 	var status=$("#show").val();
	var obj = document.getElementById("obj2");
	  var array = getSelectArray(obj);
	  if(array.length==0){
	    alert("请选择人员");
	    return;
	  }
	  var ids="";
	  for(var i=0;i<array.length;i++){
	  	if(ids==''){
	  		ids=array[i].value;
	  	}else{
	  		ids+=","+array[i].value;
	  	}
	  }
	 window.opener.setValue(ids,status);
	  window.close();
}

</script>
</head>

<body >
<table align="center"><tr><td>
<div class="divuser">
<input type="hidden" value="${nodeId}" id="show">
<h1 style="background:url(image/usebg.jpg); height:30px; margin:0; text-align:center; line-height:30px; font-size:16px">
选择人员</h1>
<div id="tree-div" style="float:left; width:150px; height:320px; border:#666 double 1px;overflow-y:auto;overflow-x:none;word-break:break-all;">
<ul id="tt2">
                    
 </ul>
</div>
<div style="width:390px; height:320px; border:#666 double 1px; float:left;overflow-y:auto;  ">
	<table border="0"> 

              <tr>
                <td>
                  <select name="possible" id="obj1" size="4" MULTIPLE style="width: 170px; height:310px;">
                    
                  </select>
                </td>
                <td>
                <input type="button"   width="45px" onclick="func1()" class="button_02" value=">" />
                <input type="button" width="25px" onclick="func3()" class="button_02" value=">>" />
				  <br/><br/>
                  <input type="button"   class="button_02" width="45px" onclick="func2()" value="<"/>
                  <input type="button" width="25px" onclick="func4()" class="button_02" value="<<"/>
                  <br /><br />
                  <input type="button" onclick="addUser()" width="25px" class="button_02" value="确定" />
				</td>
                <td>
                  <select name="chosen" id="obj2" size="4" MULTIPLE style="width: 170px;height:310px">
                     
                  </select>
                </td>
              </tr>  
            </table>
</div>
</div>
</td></tr></table>
</body>
</html>